<template>
	<view class="retirementDetail">
		<view class="header">
			<h3>个人信息</h3>
		</view>
		<view class="top">
			<u-cell-group>
				<u-cell title="申请人" :value="info.creatUserName" center></u-cell>
				<u-cell title="处置资产总金额" :value="info.totalPrice" center></u-cell>
				<u-cell title="当前流程节点" :value="info.exNode" center></u-cell>
				<u-cell title="状态" :value="info.state" center></u-cell>

			</u-cell-group>
		</view>
		<view class="header">
			<h3>资产信息</h3>
			<!-- 申报 -->
			<view style="width:30%" @click="editAssets">
				<u-button type="primary" text="编辑申报资产"></u-button>
			</view>

		</view>
		<view class="top" v-for="(v, i) in pretreatment" :key="i">
			<u-cell-group>
				<u-cell :title="'资产列表' + (i + 1)" center>
					<view slot="value" @click="deleteTo(i)">
						<view style="display:flex;align-items: center;">
							<u-icon name="close" color="red" size="28"></u-icon>
							<text style="color:red">删除</text>
						</view>
					</view>
				</u-cell>
				<u-cell title="资产编码" :value="v.assetsNo" center></u-cell>
				<u-cell title="资产名称" :value="v.assetsName" center></u-cell>
				<u-cell title="资产价值" :value="v.assetsPrice" center></u-cell>
				<u-cell title="保管单位" :value="v.depository" center></u-cell>
			</u-cell-group>
		</view>

		<u-cell-group title="流程节点">
			<view style="padding:10px;padding-bottom:100px">
				<u-steps :current="current" direction="column">
					<u-steps-item v-for="(item, index) in list.filter((x) => x.exUserName)" :key="index"
						:title="`${item.node}`">
						<text class="slot-icon" slot="desc">审批人：{{ item.exUserName }}</text>
						<text v-if="item.remark" class="slot-icon" slot="desc">备注：{{ item.remark }}</text>
						<!-- 1下一步 -1驳回 0取消 -->
						<text v-if="item.type != -10" :class="item.type == 1 ? 'slot-left' : 'slot-right'"
							slot="desc">审批状态：{{
									item.type == 1 ? '同意' : item.type == -1 ? '驳回' : '拒绝'
							}}</text>

						<text v-if="item.flowTime" class="slot-icon" slot="desc">审批时间：{{ item.flowTime }}</text>
					</u-steps-item>
				</u-steps>
			</view>
		</u-cell-group>

		<!-- 审批弹框 -->
		<u-popup :show="isFlag" mode="bottom" :closeable="true" @close="isFlag = false">
			<view style="padding: 15px 10px">
				<u-form labelPosition="left" :model="model">
					<!-- 审批意见 -->
					<u-form-item label="审批意见">
						<u-textarea v-model="model.remark" placeholder="请输入审批意见"></u-textarea>
					</u-form-item>
					<u-form-item label="申报金额上限" v-if="model.type == -1">
						<u-number-box v-model="model.maxPrice"></u-number-box>
					</u-form-item>
					<u-form-item>
						<view class="foor">
							<u-button size="large" type="primary" text="确认" @click="DoEx"></u-button>
						</view>
					</u-form-item>
				</u-form>
			</view>
		</u-popup>

		<!-- 审批 -->
		<view class="btn" v-if="info.exNode != '结束'">
			<u-button v-if="list[current].node == '单位负责人审批'" size="large" type="primary" text="审批"
				@click="btn('审批', 1)">
			</u-button>
			<u-button v-else size="large" type="primary" text="重新提交" @click="btn('重新提交', 1)"></u-button>
			<u-button size="large" type="error" text="拒绝" @click="btn('拒绝', 0)"></u-button>
			<u-button size="large" type="warning" text="驳回" @click="btn('驳回', -1)"></u-button>
			<u-button v-if="info.creatUser == userInfo.userInfo.userId" size="large" type="error" text="取消"
				@click="cancle">
			</u-button> <!-- 这里差一个判断，只能是申请人取消 -->
		</view>
	</view>
</template>

<script>
export default {

	data() {
		return {
			objectID: '',
			templateDetail: [],
			model: {
				objectID: "",
				button: "",
				assetsIDs: [],
				type: 1,
				remark: "",
				exUser: "",
				exUserName: "",
				maxPrice: 0
			},
			list: [], //审批流程
			current: 0, //步骤
			info: {},
			isFlag: false,

			items: [{
				value: 0,
				name: '拒绝'
			},
			{
				value: 1,
				name: '同意'
			},
			],
			userInfo: {},
			pretreatment: [],
		}
	},
	onLoad(e) {
		this.objectID = e.objectID
		this.detail(this.objectID)
		this.AssetsScrapGetExFlow()
	},
	onShow() {
		this.userInfo = uni.getStorageSync('userInfo')
		uni.$once('query', (query) => {
			this.pretreatment = query.list
		});
	},
	methods: {

		// 编辑资产
		editAssets() {
			const objectID = this.pretreatment.map((x) => x.objectID)
			uni.navigateTo({
				url: '/pages/retirement/Editasset?objectID=' + JSON.stringify(objectID)
			})
		},
		// 删除
		deleteTo(index) {
			this.pretreatment.splice(index, 1)
		},
		detail(objectID) {
			this.$u.api.AssetsScrapGetDetils({
				objectID: objectID
			}).then(res => {
				this.info = res.data.info
				this.templateDetail = res.data.wares
				this.pretreatment = res.data.pretreatment
			})
		},

		// 审批流程
		AssetsScrapGetExFlow() {
			this.$u.api.AssetsScrapGetExFlow({
				objectID: this.objectID
			}).then(res => {
				this.list = res.data
				this.current = res.data.filter((x) => x.isFlag).length

			})
		},

		// 审批
		btn(name, type) {
			this.model = {
				button: name,
				type: type,
				objectID: "",
				assetsIDs: [],
				remark: "",
				exUser: "",
				exUserName: "",
				maxPrice: 0
			}
			this.isFlag = true

		},
		// 确定
		DoEx() {
			if (!this.model.remark) return this.$u.toast('请输入备注');

			const data = {
				objectID: this.objectID,
				button: this.model.button,
				type: this.model.type,
				remark: this.model.remark,
				exUser: this.model.exUser,
				exUserName: this.model.exUserName,
				assetsIDs: this.model.button == '重新提交' ? this.pretreatment.map((x) => x.objectID) : [],
				maxPrice: this.model.type == -1 ? this.model.maxPrice : 0

			}

			this.$u.api.AssetsScrapDoEx(data).then((res) => {
				this.$u.toast('提交成功');
				this.AssetsScrapGetExFlow()
				this.detail(this.objectID)
				this.isFlag = false
			})
		},

		// 取消
		cancle() {

			const data = {
				objectID: this.objectID,
				type: "AssetsDevert",
				isTui: true
			}
			var _this = this
			wx.showModal({
				title: '提示',
				content: '是否确定取消?',
				success(v) {
					if (v.confirm) {
						_this.$u.api.CancelEx(data).then(res => {
							if (res) {
								_this.$u.toast('取消成功');
								_this.detail(this.objectID)
							}
						})
					}
				}
			})

		}

	}
}
</script>

<style lang="scss" scoped>
.retirementDetail {
	.header {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 15upx;

		h3 {
			font-size: 32upx;
			font-weight: bold;
			padding: 15upx;
		}
	}

	.top {
		border-bottom: 20upx solid #cccccc;
	}

	/deep/.u-text__value--content.data-v-50004b49 {
		color: #323233;
		font-size: 16px !important;
		font-weight: bold !important;
	}

	/deep/.u-text__value.data-v-50004b49 {
		color: #323233;
		font-size: 16px !important;
		font-weight: bold !important;

	}

	/deep/.u-steps-item__content--column.data-v-3ae6176e {
		flex-direction: column;
		margin-left: 6px;
		line-height: 25px;
	}

	.slot-left {
		color: #3c9cff;
	}

	.slot-right {
		color: #e7605d;
	}

	.btn {
		position: fixed;
		bottom: 0;
		display: flex;
		align-items: center;
		left: 0;
		right: 0;
	}

	.foor {
		display: flex;
		align-items: center;
	}

	.btnClass {
		height: 80vh;
		overflow-y: auto;
		// height: 500px;
		// width: 90%;
		// overflow-y: auto;
		// background: yellow

	}

	/deep/radio-group {
		display: flex;
	}

	/deep/.u-popup__content.data-v-3a231fda {
		background-color: #fff;
		position: relative;
		padding: 10px;
	}
}
</style>
